<template>
    <div id="app">
        <div v-if="token">
            <top></top>
            <div class="main">
                <left></left>
                <div class="right">
                    <router-view></router-view>
                </div>
            </div>
        </div>
        <div v-else>
            <router-view></router-view>
        </div>
    </div>
</template>

<script>
  import top from '@/components/common/top';
  import left from '@/components/common/left';
  import {mapGetters} from 'vuex';

  export default {
    name: 'app',
    data () {
      return {};
    },
    created () {
      console.log(this.$route);
      if (this.token === '' && this.$route.path !== '/login') {
        this.$router.push('/login');
      }
    },
    components: {
      left,
      top
    },
    computed: {
      ...mapGetters([
        'user',
        'token'
      ])
    }
  };
</script>

<style lang="stylus">
  @import "assets/normalize.css";
  @import "assets/base.css";
#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #2c3e50;
}
</style>
